<template>
  <div>
    <my-form-drawer :title="title" :width="450" :visible="visible" @ok="edit" @cancel="onClose" :footer="type!=2">
      <a-form-model ref="form" :model="form" :rules="rules">
        <a-form-model-item label="白名单词汇" prop="word">
          <a-input v-model="form.word" :maxLength="50" :disabled="type==2"/>
        </a-form-model-item>
        <a-form-model-item label="备注" prop="remark">
          <a-textarea v-model="form.remark" :rows="4" placeholder="请输入备注"  :disabled="type==2"/>
        </a-form-model-item>
      </a-form-model>
    </my-form-drawer>
  </div>
</template>

<script>
import moment from 'moment';
import { addwhite, updatewhite } from '@/services/word';
import { itemList } from "@/services/word";
import MyFormDrawer from '@/components/drawer/MyFormDrawer';
import {rule} from "@/utils/validateRules"

export default {
  name: 'UserForm',
  components: { MyFormDrawer },
  data() {
    return {
      type: '0', //0添加，1编辑
      title: '',
      form: {
        word: '',
        sensitiveType: 'WHITE',
        remark: '',
      },
      itemType:'sensitive',
      itemList: [],
      visible: false,
      rules: {
        word: [{ required: true, message: '敏感词不能为空', trigger: 'change' },
          { validator:rule.checkSpace, message: '敏感词不能为空', trigger: 'blur' },
        ],
      },
      page: {
        currentPage: 1,
        pageSize: 10,
      },
    };
  },
  computed: {},
  created() {
    this.getItemList()
  },
  methods: {
    getItemList(){
      itemList({type:this.itemType}).then(res => {
        const { data } = res.data;
        this.itemList = data;
      });
    },
    setWordType(value){
      this.form.wordType = value
      console.log(this.form.wordType);
      },
    moment,
    initData() {
      this.form = {
        word: '',
        wordType: '',
        sensitiveType: 'WHITE',
      };
    },

    changeForm(state, action, data) {
      this.visible = state;
      this.type = action;
      switch (this.type) {
        case 0: this.title = '新增白名单词汇'; break;
        case 1: this.title = '编辑白名单词汇'; break;
        case 2: this.title = '查看白名单词汇'; break;
      }
      if (this.type) {
        this.form = Object.assign(this.form, data);
        console.log(this.form);
      }
    },
    onClose() {
      this.visible = false;
      this.$refs['form'].clearValidate();
      this.initData();
    },
    edit() {
      this.$refs.form.validate((valid) => {
        if (!valid) {
          return false;
        }
        if (this.type) {
          updatewhite(this.form).then((res) => {
            console.log(res);
            if (res.data.code === 0) {
              this.$message.success('修改成功');
              this.onClose();
              this.$emit('getList');
            }
          });
        } else {
          addwhite(this.form).then((res) => {
            console.log(res);
            if (res.data.code === 0) {
              this.$message.success('添加成功');
              this.onClose();
              this.$emit('getList');
            }
          });
        }
      });
    },
  },
};
</script>

<style lang="less" scoped></style>
